<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
   ______                  __  __
  / ____/___  __  ______  / /_/ /_  __
 / /   / __ \/ / / / __ \/ __/ / / / /
/ /___/ /_/ / /_/ / / / / /_/ / /_/ /
\____/\____/\__,_/_/ /_/\__/_/\__, /
              http://count.ly/____/
-->
<html>
<head>
	<title><%- countlyTitle %></title>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <meta name="referrer" content="no-referrer">
    <script><%- javascript %></script>
	<link rel="icon" type="image/png" href="<%- cdn %><%- countlyFavicon %>">
    <script type="text/javascript">
        //no one should really need this
        window.eval = function(){
            console.log("eval not available");
            window.Countly = window.Countly || {};
            Countly.q = Countly.q || [];
            Countly.q.push(['log_error', new Error("eval not available")]);
        };
        window.paceOptions = {
            ajax: {
                ignoreURLs: ["action=refresh", "method=live", "stats.count.ly", "method=get_events", "display_loader=false"]
            }
        };
    </script>
    <link rel="stylesheet" href="<%- cdn %>stylesheets/font-awesome/css/font-awesome.min.css?<%= countlyVersion %>" />
    <link rel="stylesheet" href="<%- cdn %>stylesheets/ionicons/css/ionicons.min.css?<%= countlyVersion %>" />
    <link rel="stylesheet" href="<%- cdn %>stylesheets/material/material-icons.css?<%= countlyVersion %>" />
    <link rel="stylesheet" href="<%- cdn %>stylesheets/vue/element-ui.css?<%= countlyVersion %>" />
	<link rel="stylesheet" href="<%- cdn %>javascripts/dom/jqueryui/jquery.ui.base.css?<%= countlyVersion %>" />
	<link rel="stylesheet" href="<%- cdn %>javascripts/dom/jqueryui/jquery.ui.theme.css?<%= countlyVersion %>" />
    <% if (production) { %>
		<link rel="stylesheet" href="<%- cdn %>stylesheets/main.min.css?<%= countlyVersion %>" />
		<link rel="stylesheet" href="<%- cdn %>stylesheets/plugins.min.css?<%= countlyVersion %>&<%= pluginsSHA %>" />
    	<!-- PRODUCTION -->
    	<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.dom.js?<%= countlyVersion %>"></script>
    	<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.utils.js?<%= countlyVersion %>"></script>
    <% } else { %>
		<link rel="stylesheet" href="<%- cdn %>stylesheets/main.css?<%= countlyVersion %>" />
		<link rel="stylesheet" href="<%- cdn %>stylesheets/vue/clyvue.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/tipsy/tipsy.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/gridstack/gridstack.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/amaranjs/amaran.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/selectize/selectize.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/leaflet/leaflet.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/countly-checkbox/countly.checkbox.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/jsoneditor/codemirror.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/vue/vue-json-pretty.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/pace/pace-theme-flash.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/utils/tooltipster/tooltipster.bundle.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>javascripts/dom/drop/drop-theme-countly.min.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/bulma/bulma-custom.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/styles/manifest.css?<%= countlyVersion %>" />
        <link rel="stylesheet" href="<%- cdn %>stylesheets/vue/element-tiptap.css?<%= countlyVersion %>" />
        <% if (stylesheets) { %>
			<% for(var i=0, l=stylesheets.length; i<l; i++) {%>
        <link rel="stylesheet" href="<%- cdn %><%= stylesheets[i] %>?<%= countlyVersion %>" />
			<% } %>
		<% } %>
	    <!-- DEVELOPMENT -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery/jquery.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.form.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/tipsy/jquery.tipsy.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.noisy.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.sticky.headers.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jqueryui/jquery-ui.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jqueryui/jquery-ui-i18n.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/slimScroll.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/jquery.easing.1.3.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/polyfills.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/underscore-min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/lodash.merge.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/lodash.mergeWith.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/prefixfree.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/gridstack/gridstack-h5.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/moment/moment-with-locales.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/handlebars.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/backbone-min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.i18n.properties.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jstz.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/store+json2.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.idle-timer.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/initialAvatar.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.amaran.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.titlealert.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.hoverIntent.minified.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/tooltipster/tooltipster.bundle.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/highlight/highlight.pack.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/dropzone.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jquery.xss.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/webfont.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/selectize.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/leaflet.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/js-deep-equals.unsorted.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/polyfill/es6-promise.auto.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/polyfill/intersection-observer.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/composition-api.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuex.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/echarts.5.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-echarts.umd.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-color.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/v-tooltip.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vee-validate.full.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-clipboard.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-good-table.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue2Dropzone.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/element-ui.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue2-leaflet.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/inViewportMixin.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuescroll.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vue-json-pretty.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/dataTables/js/jquery.dataTables.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/dataTables/js/TableTools.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/pace/pace.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/drop/tether.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/dom/drop/drop.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/simpleUpload.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/codemirror.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/javascript.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/json2.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/jsonlint.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/minify.json.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/jsoneditor/jsoneditor.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/Sortable.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/vue/vuedraggable.umd.min.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/countly.checkbox.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.auth.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/element-tiptap.umd.min.js?<%= countlyVersion %>"></script>
    <% } %>

    <% if (themeFiles && themeFiles.css) { %>
        <% for(var i=0, l=themeFiles.css.length; i<l; i++) {%>
    <link href='<%= themeFiles.css[i]%>?<%= countlyVersion %>' rel='stylesheet' type='text/css'>
        <% } %>
    <% } %>
    <script type="text/javascript">
	window.production = <%= production ? true : false %>;

	function loadMeterialIcons(canRetry) {
		WebFont.load({
			custom: {
				families: ['Material Icons'],
				urls: ['stylesheets/material/material-icons.css']
			},
			fontinactive: function (family, fvd) {
				if(canRetry){
					loadMeterialIcons(false); /* only try one more time */
				}
			},
			timeout: 5000
		})
	}
	loadMeterialIcons(true);
    </script>
    <% if (typeof inject_template.css != 'undefined') { %>
	<style><%- inject_template.css %></style>
	<% } %>
</head>
<body>
	<div id="main-views-container" class="bu-is-flex">
        <div id="cly-vue-sidebar" data-test-id="dashboard-sidebar">
            <div id="sidebar-x"></div>
        </div>
        <div class="main-view">
            <div id="content"></div>
        </div>
	</div>

	<div id="overlay"></div>
	<div id="vue-modal-manager"></div>
    <div id="cly-resource" class="dialog black" style="max-width: 800px; max-height: 600px;">
        <div class="content"></div>
    </div>
	<div id="cly-popup" class="dialog black">
		<div class="indicator"></div>
		<div class="content"></div>
	</div>
	<div id="cly-loading" class="dialog black">
 		<div class="indicator"></div>
 		<div class="message"></div>
 		<div class="content">
 			<div class="loading-bars"> </div>
 		</div>
 	</div>
	<div id="cly-alert" class="dialog">
		<div class="indicator"></div>
        <div class="image"></div>
        <div class="title"></div>
		<div class="message"></div>
		<div class="buttons">
				<a id="dialog-ok" class="icon-button light" data-localize="common.ok"></a>
		</div>
	</div>
	<div id="cly-confirm" class="dialog">
		<div class="indicator"></div>
        <div class="image"></div>
        <div class="title"></div>
		<div class="message"></div>
		<div class="buttons">
            <div><div id="dialog-continue" class="icon-button light" data-localize="common.continue"></div></div>
            <div><div id="dialog-cancel" class="icon-button light" data-localize="common.cancel"></div></div>
		</div>
    </div>
    <div id="cly-json-editor" class="dialog json-dialog">
        <div class="header">
            <div class="title" data-localize="common.json-editor"></div>
            <div class="json-options">
                <div class="valid-json json-status">
                    <i class="material-icons">check_circle</i>
                    <span class="text" data-localize="common.valid-json"></span>
                </div>
                <div class="invalid-json json-status" style="display:none">
                    <i class="material-icons">warning</i>
                    <span class="text" data-localize="common.invalid-json"></span>
                </div>
                <div id="dialog-format" class="icon-button light" data-localize="common.format"></div>
            </div>
        </div>
        <div class="body">
        </div>
        <div class="buttons">
            <div id="dialog-cancel" class="icon-button light" data-localize="common.cancel"></div>
            <div id="dialog-continue" class="icon-button light" data-localize="common.saveJSON"></div>
        </div>
    </div>
    <div id="cly-export" class="dialog export-dialog">
		<p data-localize="export.export-as"></p>
        <div id="export-type-selector" class="button-selector light">
            <div class="button selected active" id="export-csv">.CSV</div>
			<div class="button" id="export-xlsx">.XLSX</div>
			<div class="button" id="export-json">.JSON</div>
        </div>
		<div class="export-columns-selector">
            <p data-localize="export.columns-to-export"></p>
            <p class="checkbox-line"><a data-index="" class="fa fa-square-o check-green check-header data-table-toggle-column export-all-columns"></a><span data-localize="export.export-all-columns"></span></p>
			
			<div class="export-columns-search"><table><tr><td><input type="text" placeholder="Search" data-localize="placeholder.search-columns" /></td><td><i class="fa fa-search"></i></td><tr></table></div>
            <div class="columns-height-wrapper">
				<div class="columns-wrapper"></div>
            </div>
        </div>
		<p class="checkbox-line export-format-option"><a data-index="" class="fa fa-square-o check-green check-header data-table-toggle-column export-format-columns"></a><span data-localize="export.format-if-possible"></span><i class="ion-information-circled"></i></p>
        <div class="icon-button green export-data" data-localize="export.export"></div>
	</div>
    <div id="cly-drawer-template" class="cly-drawer">
        <div class="title">
            <span></span>
            <div class="close"><i class="ion-ios-close-empty"></i></div>
        </div>
        <div class="details"></div>
        <div class="buttons">
            <div class="icon-button green disabled save-drawer-button"></div>
        </div>
    </div>

	<div id="edit-account-details">
		<div class="message">
			<div>
				<div class="title" data-localize="user-settings.username"></div>
				<div class="input"><input id="username" type="text" value="" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}"/></div>
			</div>
			<div style="margin-top:15px;">
				<div class="title" data-localize="user-settings.change-password"></div>
				<div class="input">
					<div><input id="old_pwd" type="password" placeholder="Old password..." data-localize="placeholder.old-password"/></div>
					<div style="margin-top:10px;"><input id="new_pwd" type="password" placeholder="New password..." data-localize="placeholder.new-password"/></div>
					<div style="margin-top:5px;"><input id="re_new_pwd" type="password" placeholder="Again..." data-localize="placeholder.again"/></div>
				</div>
			</div>
			<div style="margin-top:15px;">
				<div class="title" data-localize="user-settings.api-key"></div>
				<div class="input"><input id="api-key" type="text" value=""/></div>
			</div>
		</div>
		<div class="buttons">
			<div id="settings-save-result" class="result-message"></div>
			<a id="save-account-details" class="icon-button light" data-localize="common.save"></a>
			<a id="dialog-cancel" class="icon-button light" data-localize="common.close"></a>
		</div>
	</div>

    <script id="template-date-selector" type="text/x-handlebars-template">
		<div id="date-selector" class="help-zone-vs">
            <div class="calendar" id="date-picker-button">
                <i class="material-icons">date_range</i>
                <span id="selected-date"></span>
                <span class="down ion-chevron-down"></span>
                <span class="up ion-chevron-up"></span>
            </div>
			<div id="date-picker">
                <div class="date-selector-buttons">
                    <div class="button date-selector" id="yesterday" data-localize="common.yesterday"></div>
                    <div class="button date-selector" id="hour" data-localize="common.today"></div>
                    <div class="button date-selector" id="7days" data-localize="taskmanager.last-7days"></div>
                    <div class="button date-selector" id="30days" data-localize="taskmanager.last-30days"></div>
                    <div class="button date-selector" id="60days" data-localize="taskmanager.last-60days"></div>
                    <div class="button date-selector" id="day"></div>
                    <div class="button date-selector" id="month"></div>

                    <!--<div class="button date-selector" id="90days" data-localize="common.90days"></div>-->
                    <div class="button-container">
                        <div id="date-submit" class="icon-button green" data-localize="common.apply"></div>
                        <div id="date-cancel" class="icon-button" data-localize="common.cancel"></div>
                    </div>
                </div>
                <div class="calendar-container">
                    <table>
                        <tr>
                            <td class="calendar-block">
                                <div id="date-from" class="calendar"></div>
                            </td>
                            <td class="calendar-block">
                                <div id="date-to" class="calendar"></div>
                            </td>
                        </tr>
                        <tr>
                            <td class="calendar-block">
                                <input type="text" class="calendar-input-field" id="date-from-input" autocomplete="off"></input><span class="date-input-label" data-localize="common.from"></span>
                            </td>
                            <td class="calendar-block">
                                <input type="text" class="calendar-input-field" id="date-to-input" autocomplete="off"></input><span class="date-input-label" data-localize="common.to"></span>
                            </td>
                        </tr>
                    </table>

				</div>
			</div>
		</div>
    </script>

	<script id="template-date-time-selector" type="text/x-handlebars-template">
		<div class="date-time-selector-container">
			<div class="calendar" id="date-picker-button">
				<i class="material-icons">date_range</i>
				<span class="date-time-value-show">Set date & time </span>
				<span class="ion-chevron-down" style="float:right;width: 15px; height: 100%; line-height: 27px;font-size: 12px; opacity: 0.8;margin-right: 5px;"></span>
			</div>
			<div class="date-time-picker">
				<div class="button-container">
					<div  class="date-submit icon-button green" data-localize="common.apply" style="float:right; margin-right:11px;"></div>
					<div  class="date-clear icon-button" data-localize="common.close" style="float:right;"></div>
				</div>
				<div class="time-field">
					<span class="time-label" data-localize="datepicker.pick-time"></span>
					<input name="hour" type="number"  onchange="if( this.value.length == 1 ) this.value='0'+this.value;" class="time-input hour" min="0" max="23" value="00"/>
					<span class="time-split"> : </span>
					<input name="minute" type="number"  onchange="if( this.value.length == 1 ) this.value='0'+this.value;" class="time-input minute" min="0" max="59" value="00"/>
				</div>
			</div>
		</div>
	</script>

	<script id="template-app-categories" type="text/x-handlebars-template">
		<div data-value="1" class="item" data-localize="application-category.books"></div>
		<div data-value="2" class="item" data-localize="application-category.business"></div>
		<div data-value="3" class="item" data-localize="application-category.education"></div>
		<div data-value="4" class="item" data-localize="application-category.entertainment"></div>
		<div data-value="5" class="item" data-localize="application-category.finance"></div>
		<div data-value="6" class="item" data-localize="application-category.games"></div>
		<div data-value="7" class="item" data-localize="application-category.health-fitness"></div>
		<div data-value="8" class="item" data-localize="application-category.lifestyle"></div>
		<div data-value="9" class="item" data-localize="application-category.medical"></div>
		<div data-value="10" class="item" data-localize="application-category.music"></div>
		<div data-value="11" class="item" data-localize="application-category.navigation"></div>
		<div data-value="12" class="item" data-localize="application-category.news"></div>
		<div data-value="13" class="item" data-localize="application-category.photography"></div>
		<div data-value="14" class="item" data-localize="application-category.productivity"></div>
		<div data-value="15" class="item" data-localize="application-category.reference"></div>
		<div data-value="16" class="item" data-localize="application-category.social-networking"></div>
		<div data-value="17" class="item" data-localize="application-category.sports"></div>
		<div data-value="18" class="item" data-localize="application-category.travel"></div>
		<div data-value="19" class="item" data-localize="application-category.utilities"></div>
		<div data-value="20" class="item" data-localize="application-category.weather"></div>
	</script>

	<script id="template-analytics-common"  type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="left">
					<div class="title">{{page-title}}</div>
				</div>
				{{> date-selector }}
			</div>

            {{#if graph-description}}
            <div class="graph-description">{{graph-description}}</div>
            {{/if}}

			{{#if drill-filter}}
			<div id="view-filter" style="background-color: #ededed !important; border-top: none !important">
				<div class="separator in-retention"></div>
				<div id="toggle-filter" style="padding:10px; cursor:pointer; position:relative; min-height:20px">
					<div id="current-filter" style="display:none; font-family:Ubuntu; font-size:15px; text-align:center; color:#999;">
					<div class="text"></div>
					<div id="remove-filter" style="position: absolute;font-size: 16px;right: 0px;top: 0px;width: 33px;height: 29px;padding-top: 11px;"><i class='ion-close'></i></div>
					</div>
					<div id="no-filter" style="font-size:13px; text-transform: uppercase;color:#5f5f5f;">
					<div class="on-off-switch" id="switch-trigger"><input type="checkbox" class="on-off-switch-checkbox" id="apply-filter-cbox"><label class="on-off-switch-label" for="apply-filter-cbox"></label></div>
					<span style="user-select: none; top: 1px; position: relative;" data-localize="drill.apply-filter">Apply Filter</span>
					</div>
				</div>
				<div class="filter-view-container centered in-retention">
					{{> filter-view }}
				</div>
			</div>
			{{/if}}

            <div class="widget-content help-zone-vb" data-help-localize="help.{{{chart-helper}}}" style="{{#if graph-type-double-pie}} overflow:hidden; {{else}} {{#if chartHTML}}  {{else}} height:300px; padding-top:35px; padding-bottom:10px; {{/if}}{{/if}}">
				{{#if graph-type-double-pie}}
				<div class="pie-chart-container">
					<div style="border-right:1px solid #CCC; width: 100%; height: 100%">
						<div class="pie-overlay one {{logo-class}}">
                            <div class="logo ion ion-person-stalker"></div>
							<div class="title">{{pie-titles.left}}</div>
						</div>
						<div id="dashboard-graph" class="graph" style="margin:0 auto !important; height:360px; font-family:'Ubuntu';"></div>
					</div>
				</div>
				<div class="pie-chart-container">
					<div class="pie-overlay two {{logo-class}}">
                        <div class="logo ion ion-person-add"></div>
						<div class="title">{{pie-titles.right}}</div>
					</div>
					<div id="dashboard-graph2" class="graph" style="margin:0 auto !important; height:360px; font-family:'Ubuntu';"></div>
				</div>
				{{else}}
                    {{#if chartHTML}}
                        {{{chartHTML}}}
                    {{else}}
                    <div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px; {{#if isChartEmpty}} display:none; {{/if}}"></div>
                    <div class="graph-no-data" {{#if isChartEmpty}} style="display:block;" {{/if}}>
                        <div class="inner">
                            <div class="icon"></div>
                            <div class="text" data-localize="common.graph.no-data"></div>
                        </div>
                    </div>
                    {{/if}}
				{{/if}}
			</div>
			{{#if big-numbers}}
			<div class="widget-footer big-numbers-v2">
				<div id="big-numbers-container">
					{{#each big-numbers.items}}
					<div class="big-numbers {{#if ../../big-numbers.class}}{{../../big-numbers.class}}{{else}}three-column{{/if}} help-zone-vs" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
                        </div>
					</div>
					{{/each}}
				</div>
			</div>
			{{/if}}
		</div>
		{{#if bars}}
		<div class="dashboard-summary {{#if bars-class}}{{bars-class}}{{else}}three{{/if}}">
			{{#each bars}}
			<div class="item help-zone-vs device-bar-item" data-help-localize="help.{{this.help}}">
				<div class="inner inner-new">
					<div class="title title-new">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar bar-new">
						{{#each this.data}}
							{{#if this.type}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{this.name}} ({{this.count}} visits)" data-percent="{{round this.percent 0}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{else}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);"
									data-item="{{this.name}}" data-percent="{{round this.percent 0}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{/if}}
						{{/each}}
						{{#forNumberOfTimesCalc 3 data.length}}
				    		<div class="bar-inner bar-inner-new" style="width:calc(100% - 30px);">
							</div>
				        {{/forNumberOfTimesCalc}}
				    </div>
					{{else}}
					<div class="bar bar-new" style="width:100% !important">
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important"
							data-item="" data-localize="common.bar.no-data" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
					</div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		{{/if}}
        <table id="dataTableOne" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        {{#if two-tables}}
            {{#if segmentation}}
            <div class="widget segmentation-widget">
                <div class="widget-header">
                    <div class="left">
                        <div class="title small">{{segment-title}}</div>
                        <div>
                            <div class="cly-select float">
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text">{{active-segment}}</div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square" style="width:220px;">
                                    <div>
                                        {{#eachOfArray segmentation}}
                                        <div data-value="{{value.value}}" class="segmentation-option item">{{value.name}}</div>
                                        {{/eachOfArray}}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="segmentation-table">
                <table id="dataTableTwo" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
            {{else}}
            <table id="dataTableTwo" class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            {{/if}}
        {{/if}}
	</script>

	<script id="template-analytics-countries"  type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="left">
					<div class="title">{{page-title}}</div>
				</div>
				{{> date-selector }}
                <div class="right">
                    <a id='country-toggle' class='icon-button light btn-header'></a>
                </div>
			</div>
            <div class="widget-tips"><a href="#/manage/configurations/frontend"><span data-localize="countries.google-api-key-remind"></a></span></div>
			<div class="widget-content help-zone-vb" data-help-localize="help.{{{chart-helper}}}" style="height:480px;">
				<div id="geo-chart-outer" class="big"><div><div id="geo-chart"></div></div></div>
			</div>
			<div class="widget-footer big-numbers-v2 geo-switch">
                {{#if big-numbers}}
				<div id="big-numbers-container">
					{{#each big-numbers.items}}
					<div data-id="{{this.radio-button-id}}" class="big-numbers radio {{#if ../../big-numbers.class}}{{../../big-numbers.class}}{{else}}three-column{{/if}} help-zone-vs {{this.radio-button-class}}" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
						</div>
					</div>
					{{/each}}
				</div>
                {{/if}}
			</div>
		</div>
		<table class="d-table help-zone-vb" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
	</script>
    <script id="template-management-plugins"  type="text/x-handlebars-template">
    	<div class="mgmt-plugins">
    	{{#eachOfArray plugins}}
    		<h3 data-index="{{value.index}}">{{value.title}}</h3>
    		<form>
    		</form>
    	{{/eachOfArray}}
    	</div>
    </script>
    <script id="template-events-blueprint"  type="text/x-handlebars-template">
        <div id="events-custom-settings">
        <div class="widget">
            <div id="evens-blueprint-config">
                <div id="tabs" style="position: unset;">
                    <ul>
                        <li><a href="#events-events" data-localize="events.blueprint-events-tab-title"></a></li>
                        <li><a href="#events-event-groups" data-localize="events.blueprint-eventgroups-tab-title"></a></li>
                    </ul>
                    <div id="events-events">
                        <div class="widget-header">
                            <div class="left">
                                <div style="overflow:auto">
                                    <div class="title small" data-localize="events.blueprint-title"></div>
                                </div>
                                <div class="cly-select float" id="events-general-filter">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text"><span data-localize="events.blueprint-events-show.all"></span></div>
                                        </div>
                                        <div class="drop-icn"></div>
                                    </div>
                                    <div id="event-filter-types" class="select-items square">
                                        <div data-value="all" class="segmentation-option item"><span data-localize="events.blueprint-events-show.all"></span></div>
                                        <div data-value="visible" class="segmentation-option item"><span data-localize="events.blueprint-events-show.visible"></span></div>
                                        <div data-value="hidden" class="segmentation-option item"><span data-localize="events.blueprint-events-show.hidden"></span></div>
                                    </div>
                                </div>
                            </div>
                            <div class="right">
                                <div class="icon-button green" id="events-apply-order" data-localize="plugins.apply"></div>
                                <div class="cly-select green disabled" id="events-general-action" style="margin-top:7px;">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text" data-localize="events.general.action.perform-action"></div>
                                        </div>
                                        <div class="right combo"></div>
                                    </div>
                                    <div class="select-items square">
                                        <div data-value="show" class="event-option item" data-localize="events.general.action.show">Show</div>
                                        <div data-value="hide" class="event-option item" data-localize="events.general.action.hide">Hide</div>
                                        <div data-value="delete" class="event-option item" data-localize="events.general.action.delete">Delete</div>
                                    </div>
                                </div>
            
                            </div>
                        </div>
                        <div class="" id="events-custom-settings-table">
                            <div class="cly-button-menu event-settings-menu" tabindex="1">
                                <a class="item event_toggle_visibility" data-changeto="hide"><i class="ion-eye-disabled"></i><span data-localize="events.general.action.hide"></span></a>
                                <a class="item event_toggle_visibility" data-changeto="show"><i class="ion-eye" ></i><span data-localize="events.general.action.show"></span></a>
                                <a class="item delete_single_event"><i class="fa fa-trash"></i><span data-localize="common.delete"></span></a>
                            </div>
                            <table class="d-table help-zone-vb no-fix events-table" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
                        </div>
                    </div>

                    <div id="events-event-groups">
                        <div class="widget-header">
                            <div class="left">
                                <div style="overflow:auto">
                                    <div class="title small" data-localize="events.blueprint-event-group-title"></div>
                                </div>
                                <div class="cly-select float" id="event-group-general-filter">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text"><span data-localize="events.blueprint-event-group-show.all"></span></div>
                                        </div>
                                        <div class="drop-icn"></div>
                                    </div>
                                    <div id="event-group-filter-types" class="select-items square">
                                        <div data-value="all" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.all"></span></div>
                                        <div data-value="visible" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.visible"></span></div>
                                        <div data-value="hidden" class="segmentation-option item"><span data-localize="events.blueprint-event-group-show.hidden"></span></div>
                                    </div>
                                </div>
                            </div>
                            <div class="right">
                                <div class="icon-button green" style="display:block !important;margin-top: 7px;margin-right: 10px;" id="new-event-group-button" data-localize="events.blueprint-event-group-new"></div>
                                <div class="icon-button green" style="margin-top: 7px;margin-right: 10px;" id="event-groups-apply-order" data-localize="plugins.apply"></div>
                                <div class="cly-select green disabled" id="event-groups-general-action" style="margin-top:7px;">
                                    <div class="select-inner">
                                        <div class="text-container">
                                            <div class="text" data-localize="events.general.action.perform-action"></div>
                                        </div>
                                        <div class="right combo"></div>
                                    </div>
                                    <div class="select-items square">
                                        <div data-value="show" class="event-option item" data-localize="events.general.action.show">Show</div>
                                        <div data-value="hide" class="event-option item" data-localize="events.general.action.hide">Hide</div>
                                        <div data-value="delete" class="event-option item" data-localize="events.general.action.delete">Delete</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="" id="event-groups-settings-table">
                            <div class="cly-button-menu event-groups-settings-menu" tabindex="1">
                                <a class="item event_toggle_visibility" data-changeto="hide"><i class="ion-eye-disabled"></i><span data-localize="events.general.action.hide"></span></a>
                                <a class="item event_toggle_visibility" data-changeto="show"><i class="ion-eye" ></i><span data-localize="events.general.action.show"></span></a>
                                <a class="item delete_single_event"><i class="fa fa-trash"></i><span data-localize="common.delete"></span></a>
                            </div>
                            <table class="d-table help-zone-vb no-fix event-groups-table" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
                        </div>
                        </div>
                </div>
            </div>
        </div>
    </div>
    <div id="events-event-settings">
        {{#if active-event}}
        <div class="widget" style="margin-left:200px;">
            <div class="widget-header widget">
                <div class="left">
                    <div class="title dynamic-title" >{{active-event.key}}</div>
                </div>
                <div class="right">
                    <div class="icon-button green" id="events-apply-changes" data-localize="plugins.apply"></div>
                </div>
            </div>
            <div class="configs title-rows-hidden" id="events-settings-table">
                <table class="d-table help-zone-vb">
                    <tr class="config-table-row">
                        <td>
                            <table class="d-table help-zone-vb">
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-key"></div>
                                        <span data-localize="events.edit.event-key-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        {{active-event.key}}
                                        <input type="hidden" value="{{active-event.key}}" name="event_key" class="event_key" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-name"></div>
                                        <span data-localize="events.edit.event-name-description"  class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_name" value="{{active-event.name}}" maxlength="127" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-description"></div>
                                        <span data-localize="events.edit.event-description-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <textarea rows="5" style="width: 100%;" class="event_description" >{{{active-event.description}}}</textarea>
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.event-visible"></div>
                                        <span data-localize="events.edit.event-visible-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <div class="on-off-switch">
                                            <input id="events.event_visible" class="on-off-switch-checkbox event_visible" type="checkbox"  {{#if active-event.is_visible}}checked {{/if}}/>
                                            <label class="on-off-switch-label" for="events.event_visible"></label>
                                            <span class="text">Enable</span>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-count"></div>
                                        <span data-localize="events.edit.display-count-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_count" maxlength="25" value="{{active-event.count}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-sum"></div>
                                        <span data-localize="events.edit.display-sum-description" class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_sum" maxlength="25" value="{{active-event.sum}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.display-duration"></div>
                                        <span data-localize="events.edit.display-duration-description"  class="config-help"></span>
                                    </td>
                                    <td>
                                        <input type="text" class="event_dur" maxlength="25" value="{{active-event.dur}}" />
                                    </td>
                                </tr>
                                <tr class="config-table-details-row">
                                    <td>
                                        <div data-localize="events.edit.omit-event-segments"></div>
                                        <span data-localize="events.edit.omit-event-segments-description"  class="config-help"></span>
                                        {{#if have_drill}}
                                            <span data-localize="events.edit.omit-event-segments-description-drill"  class="config-help"></span>
                                        {{/if}}
                                    </td>
                                    <td>
                                        <select id="event-management-projection">
                                        </select>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        {{/if}}
    </div>

<div id="events-blueprint-drawer" class="cly-drawer">
    <div class="title" style="width: 100%;top: 0px; box-sizing:border-box">
        <span id="edit-event-blueprint-title" data-localize="events.blueprint-drawer-title"></span>
        <div class="close"><i class="ion-ios-close-empty"></i></div>
    </div>

    <div class="details">
        <div class="section">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-key"></div>
            <div class="label-desc" data-localize="events.edit.event-key-description" class="config-help"></div>
            <div>
                <input id="eb-key-name" class="input" type="text" disabled="true"">
            </div>
        </div>
        <div class="section">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-name"></div>
            <div class="label-desc" data-localize="events.edit.event-name-description" class="config-help"></div>
            <div>
                <input id="eb-event-name" class="input" type="text">
            </div>
        </div>
        <div class="section" id="eb-description-section">
            <div class="label" style="position: relative; margin-bottom: 4px;">
                <a class='fa fa-square-o check-green' id="eb-description-checkbox" style="position:relative; vertical-align:middle; bottom: 1px"></a>
                <span data-localize="events.blueprint-drawer-use-description" style="position: absolute; left: 20px"></span>
            </div>
            <div class="description" data-localize="events.edit.event-description-description" style="margin-bottom: 8px;"></div>
            <input id="eb-event-desc-input" class="input" data-localize="placeholder.events.edit.description" type="text" style="display: none;" />
        </div>
        <div class="section" id="eb-event-visibility">
            <div class="label" style="margin-bottom:4px;" data-localize="events.edit.event-visibility"></div>
            <div class="label-desc" data-localize="events.edit.event-visible-description" class="config-help"></div>
            <div class="on-off-switch">
                <input style="vertical-align: middle;" type="checkbox" class="on-off-switch-checkbox alert-switcher" id="event-status-toggler">
                <label style="vertical-align: middle;" class="on-off-switch-label" for="event-status-toggler"></label>
                <span class="text" style="vertical-align: middle; margin-bottom: 0px;opacity: 1" data-localize="events.edit.event-visible"></span>
            </div>
        </div>
        <div class="section" id="eb-event-properties-section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.edit.event-properties'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-properties-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>
                <div class="panel-body">
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-count"></div>
                        <div class="label-desc" data-localize="events.edit.display-count-description" class="config-help"></div>
                        <div>
                            <input id="eb-count-name" data-localize="placeholder.events.edit.count" class="input" type="text">
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-sum"></div>
                        <div class="label-desc" data-localize="events.edit.display-sum-description" class="config-help"></div>
                        <div>
                            <input id="eb-sum-name" data-localize="placeholder.events.edit.sum" class="input" type="text">
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" style="margin-bottom:4px;" data-localize="events.edit.display-duration"></div>
                        <div class="label-desc" data-localize="events.edit.display-duration-description" class="config-help"></div>
                        <div>
                            <input id="eb-duration-name" data-localize="placeholder.events.edit.duration" class="input" type="text">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="section" id="eb-event-omit-section">
            <div class="panel">
                <div class="panel-heading" data-localize="events.edit.omit-event-segments"></div>
                <div class="panel-body">
                    <div class="section">
                        <div class="label-desc" data-localize="events.edit.omit-event-segments-description" class="config-help"></div>
                        <div class="label-desc" style="margin-bottom: 12px;" data-localize="events.edit.omit-event-segments-description-drill" class="config-help"></div>
                        <div class="label" data-localize="events.edit.omit-event-segments-to-omit"></div>
                        <div id="eb-multi-omit-segments-drop" class="cly-multi-select" style="width: 100%; box-sizing: border-box;">
                            <div class="select-inner">
                                <div class="text-container">
                                    <div class="text">
                                        <div class="default-text" data-localize="events.edit.omit-event-select-segments"></div>
                                    </div>
                                </div>
                                <div class="right combo"></div>
                            </div>
                            <div class="select-items square" style="width: 100%;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="buttons">
        <div id="save-event" class="icon-button green" data-localize="common.save"></div>
    </div>
</div>

<div id="event-groups-blueprint-drawer" class="cly-drawer">
    <div class="details">
        <input type="text" id="current_group_id" hidden/>

        <div class="section">
            <div class="label" data-localize='events.event-group-name' ></div>
            <div>
                <input id="group-name-input" class="input" type="text" placeholder="Enter event group name"/>
            </div>
        </div>

        <div class="section">
            <div class="use-description">
                <label class="container">
                    <input id="use-description-checkbox" type="checkbox" />
                    <span class="fas far fa-square"></span>
                    <span data-localize="events.group-use-description">Use description</span>
                </label>
            </div>
            <div>
                <input id="event-group-description" class="input" type="text" placeholder="Enter event group description" disabled/>
            </div>
        </div>

        <div class="section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.group-include-events'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-group-include-events-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>

                <div class="panel-body include-events-block">
                        <div class="label" data-localize='events.group-select-events'></div>
                        <div id="event-group-include-events-dropdown" class="cly-multi-select" style="width: 100%; box-sizing: border-box;" data-max="100">
                            <div class="select-inner">
                                <div class="text-container">
                                    <div class="text">
                                        <div class="default-text" data-localize='events.group-select-events-remind'></div>
                                    </div>
                                </div>
                                <div class="right combo"></div>
                            </div>
                            <div class="select-items square" style="width: 100%;"></div>
                        </div>
                </div>
            </div>
        </div>

        <div class="section">
            <div class="label" data-localize="events.group-visibility"></div>
            <div class="description" style="margin-bottom: 10px" data-localize="events.group-visibility-description"></div>
            <div class="event-group-visibility-switcher">
                <div class="on-off-switch" id="switch-trigger">
                    <input type="checkbox" class="on-off-switch-checkbox" id="event-group-visibility-checkbox" checked="">
                    <label class="on-off-switch-label" for="event-group-visibility-checkbox"></label>
                    <span class="text" style="opacity: 1" data-localize="events.group-visibility-checkbox"></span>
                </div>
            </div>
        </div>

        <div class="section">
            <div class="panel">
                <div class="panel-heading">
                    <div class="left">
                        <div style="float: left" data-localize='events.group-properties'></div>
                        <i style="margin-left:10px;float: left;opacity: 0.5" class="eb-event-group-properties-events-tooltip ion-information-circled show-tooltip"></i>
                    </div>
                    <div style="clear: both" class="right">
                        <div data-localize=""></div>
                    </div>
                </div>

                <div class="panel-body event-group-properties-block">
                     <div class="section">
                        <div class="label" data-localize='events.event-group-count' ></div>
                        <div class="description" data-localize='events.event-group-count-description'></div>
                        <div>
                            <input id="group-count-input" class="input" type="text" placeholder="Count"/>
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" data-localize='events.event-group-sum' ></div>
                        <div class="description" data-localize='events.event-group-sum-description'></div>
                        <div>
                            <input id="group-sum-input" class="input" type="text" placeholder="Sum"/>
                        </div>
                    </div>
                    <div class="section">
                        <div class="label" data-localize='events.event-group-duration' ></div>
                        <div class="description" data-localize='events.event-group-duration-description'></div>
                        <div>
                            <input id="group-duration-input" class="input" type="text" placeholder="Duration"/>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        
    </div>
    <div class="buttons">
        <div id="create-widget" class="icon-button green disabled" data-localize='events.create-group'></div>
        <div id="save-widget" class="icon-button green disabled" data-localize='events.save-group'></div>
    </div>
</div>
    </script>

    <script id="template-events-overview"  type="text/x-handlebars-template">
		<div id="event-main">
            <div class="widget">
				<div id="top-events-widget-container">
                    {{#if topEventsIsVisible}}
                    <div class="top-events-widget">
                        <div class="widget-header top-events-widget-header" data-localize="events.top-events.title"></div>
                        <div class="outer">
                            <div class="row border">
                                <div class="left title" data-localize="events.top-events.yesterday"></div>
                                <div class="right">
                                    {{#eachOfObjectValue getTopEventDataDaily}}
                                    {{isDeletedEvent}}
                                        {{#ifCond isDeletedEvent "==" true}} 
                                            <div style="cursor: default;pointer-events: none;" class="col">
                                                <h4 style="cursor: default;color:#DDD">{{this.name}}</h4>
                                                <label style="cursor: default;color:#DDD">{{this.count}}</label> <span style="color:#DDD"; class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{else}}
                                            <div class="col">
                                                <h4><a href="#/analytics/events/key/{{encodeURIComponent this.name}}">{{this.name}}</a></h4>
                                                <label>{{this.count}}</label> <span class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{/ifCond}}
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            <div class="row">
                                <div class="left title" data-localize="events.top-events.30days"></div>
                                <div class="right">
                                    {{#eachOfObjectValue getTopEventData30Day}}
                                    {{isDeletedEvent}}
                                    {{#ifCond isDeletedEvent "==" true}} 
                                            <div style="cursor: default;pointer-events: none;" class="col">
                                                <h4 style="cursor: default;color:#DDD">{{this.name}}</h4>
                                                <label style="cursor: default;color:#DDD">{{this.count}}</label> <span style="color:#DDD"; class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                        {{else}}
                                            <div class="col">
                                            
                                                <h4><a href="#/analytics/events/key/{{encodeURIComponent this.name}}">{{this.name}}</a></h4>
                                                <label>{{this.count}}</label> <span class="{{this.trendClass}}">{{this.trendText}}</span>
                                            </div>
                                    {{/ifCond}}
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            <div class="info_text" data-localize="events.top-events.info-text"></div>
                        </div>
                        {{/if}}
                    </div>
				</div>
                <div class="widget-header">
                    <div class="left">
                        <div class="title dynamic-title" data-localize="events.overview.title"></div>

                    </div>
                    <div class="right">
                        {{#ifCond admin_rights "==" true}}{{#ifCond event-count "!=" "0"}}<div class="icon-button green" id="events-overview-show-configure" data-localize="events.overview.configure"></div>{{/ifCond}}{{/ifCond}}
                        {{> date-selector }}
                    </div>
                </div>
                <div id="eventOverviewContainer" class="widget-content">
                    <div id="eventOverviewWidgets">
                    {{#ifCond event-count "==" "0"}}
                        <div style=" min-height:100px; padding:0px;">
                            <div class="events-empty-block" >
                                 <table>
                                    <tr>
                                        <td>
                                            <p class="events-empty-title" data-localize="events.all.empty-title"></p>
                                            <p class="events-empty-text" data-localize="events.all.empty-text">
                                        </td>
                                        <td>
                                            <div class="events-empty-image events-overview-noevents"></div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    {{else}}
                    {{#ifCond overview-length "==" "0"}}
                        <div style=" min-height:100px; padding:0px;">
                            <div class="events-empty-block" >
                                <table>
                                    <tr>
                                        <td>
                                            <p class="events-empty-title" data-localize="events.overview.empty-title"></p>
                                            {{#ifCond admin_rights "==" true}}<p class="events-empty-text" data-localize="events.overview.empty-text-admin"></p>{{else}}
                                            <p class="events-empty-text" data-localize="events.overview.empty-text-user">
                                            {{/ifCond}}
                                        </td>
                                        <td>
                                            <div class="events-empty-image events-overview-configure"></div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    {{else}}
                        <div class="tooltip_templates">
                            {{#eachOfArray overview-graph}}
                            <div id="event-description-box-{{this.value.ord}}" >
                                <div style="width:200px;">
                                    <div class="flow-config-popup-block">{{{this.value.description}}}</div>
                                </div>
                            </div>
                            {{/eachOfArray}}
                        </div>
                        <table style="width:100%;  table-layout: fixed; border:1px solid #D0D0D0;">
                            {{#eachOfArray tabledGraph}}
                                <tr>
                                    {{#eachOfArray this.value}}

                                        {{#if this.value.name}}
                                        <td class="event-overview-grid-block cly-widget">
                                            <div class="title"><a href="#/analytics/events/key/{{encodeURIComponent this.value.key}}">{{this.value.name}}</a></div>
                                            {{#ifCond this.value.description "!=" ""}}<i class="fa fa-info-circle show-my-event-description"  data-tooltip-content=" #event-description-box-{{this.value.ord}}"></i>{{/ifCond}}
                                            <table>
                                                <tr>
                                                     <td colspan="2">
                                                        <div class="spark spark-{{this.value.property}}" values="{{this.value.data}}"></div >
                                                    </td>
                                                </tr>
                                                <tr class="number">
                                                    <td colspan="2">
                                                        <table>
                                                        <tr><td class="value">{{this.value.count}}</td>
                                                        <td class="trend {{this.value.classdiv}}">
                                                            <i class="material-icons">{{this.value.arrow_class}}</i>
                                                            <span class="val {{this.value.trendClass}}">{{this.value.trendText}}</span>
                                                        </td></tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                            </table>
                                            <div class="overview-item-property">{{this.value.prop}}</div>
                                          </td>
                                         {{else}}
                                           <td class="empty_cell"><div><div class="title"></div></div></td>
                                        {{/if}}
                                    </td>
                                    {{/eachOfArray}}
                                </tr>
                            {{/eachOfArray}}
                        </table>
                    {{/ifCond}}
                    {{/ifCond}}
                    </div>
                </div>

            </div>

        </div>
        <div id="event-overview-drawer" class="cly-drawer">
            <div class="title">
                <span data-localize="events.overview.drawer-title">Overview</span>
                <div class="close"><i class="ion-ios-close-empty"></i></div>
            </div>
            <div class="details">
                <div class="settings section">
                    <div  class="label" data-localize="events.overview.add-item"></div>
                    <div class="adding-to-overview">
                        <div><div class="wrap-overview-item">
                            <div class="cly-select" id="events-overview-event" >
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text" data-localize="events.overview.choose-event"></div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square">
                                    {{#eachOfObjectValue event-map}}
                                        <div data-value="{{this.key}}" class="event-option item" >{{this.name}}</div>
                                    {{/eachOfObjectValue}}
                                </div>
                            </div>
                            </div>
                        </div>
                        <div><div class="wrap-overview-item">
                            <div class="cly-select" id="events-overview-attr" >
                                <div class="select-inner">
                                    <div class="text-container">
                                        <div class="text" data-localize="events.overview.choose-property"></div>
                                    </div>
                                    <div class="right combo"></div>
                                </div>
                                <div class="select-items square">
                                    <div data-value="sum" class="event-option item" data-localize="events.table.sum"></div>
                                    <div data-value="dur" class="event-option item" data-localize="events.table.dur"></div>
                                    <div data-value="count" class="event-option item" data-localize="events.table.count"></div>
                                </div>
                            </div>
                            </div>
                        </div>
                        <div>
                            <div id="add_to_overview" class="icon-button green disabled" data-localize="events.overview.add-item" ></div>
                        </div>
                    </div>
                </div>
                <div class="settings section" id="events-overview-table-wrapper">
                    <div  class="label" data-localize="events.overview.added-items" {{#ifCond overview-table-length "==" "0"}} style="display:none" {{/ifCond}} ></div>
                    <div id="events-overview-table" {{#ifCond overview-table-length "==" "0"}} style="display:none" {{/ifCond}} >
                     <table class="events-table">
                        <thead>
                            <tr>
                                <th></th>
                                <th data-localize="events.overview.table.title-event"></th>
                                <th data-localize="events.overview.table.title-property"></th>
                                <th></th>
                            </tr>
                        </thead>
                        {{#eachOfObjectValue overview-list}}
                        <tr data-order-key ="{{this.order}}" >
                            <td style="text-align:center;"><i class="fa fa-reorder event-order"></i></td>
                            <td>{{this.eventName}}</td>
                            <td>{{this.propertyName}}</td>
                            <td ><a data-order-key ="{{this.order}}" class="ion-backspace delete-event-overview"></a></td>
                         </tr>
                        {{/eachOfObjectValue}}
                    </table>
                    </div>
                </div>
            </div>
            <div class="buttons">
                <div id="update_overview_button" class="icon-button green disabled" data-localize="events.overview.save-changes" >Save</div>
            </div>
        </div>
    </script>
	<script id="template-events"  type="text/x-handlebars-template">

        {{#ifCond event-count "==" "0"}}
        <div style="min-height:100px; padding:50px; 10px 0 10px">
            <div class="events-empty-block" >
                <table>
                    <tr>
                        <td>
                            <p class="events-empty-title" data-localize="events.all.empty-title"></p>
                            <p class="events-empty-text" data-localize="events.all.empty-text">
                        </td>
                        <td>
                            <div class="events-empty-image all-events-empty"></div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        {{else}}
        
		<div id="event-nav">
			<div id="event-nav-head">
				<div id="event-nav-title" style="max-width: 120px;" data-localize="events.title"></div>
				<div style="overflow:hidden; position:absolute; top:14px; right:10px;">
					<div class="icon-button help-zone-vs" id="edit-events-button" style="<% if(!member['global_admin']) { %> display:none; <% } %>">
                      <a href="#/analytics/manage-events"> <i class="ion-gear-a"></i></a>
					</div>
				</div>
			</div>
            <div class="nav-search">
                <i class="fa fa-search"></i>
                <input type="search" readonly onfocus="if (this.hasAttribute('readonly')) {this.removeAttribute('readonly'); this.blur(); this.focus();}"/>
            </div>
			<div class="scrollable" style="max-height:450px;">
				{{#eachOfArray events}}
                    <div class="searchable event-container {{#if value.is_active}}active{{/if}}" data-key="{{value.key}}">
                        <div class="name">
                        {{value.name}}
                        {{#if value.is_event_group}}
                        	<div class="group-badge">GROUP</div>
                    	{{/if}}
                    	</div>
                    </div>
				{{/eachOfArray}}
			</div>
		</div>

		<div id="event-main" style="margin-left:199px;">
        <div id="event-alert"></div>
		<div class="widget">
			<div class="widget-header" id="events-widget-header">
				<div class="left">
					<div id="event-update-area">
                        {{#if segmentations}}
						<div class="title dynamic-title small">
							<div class="event-title">{{page-title}}</div>
							{{#if is_event_group}}
								<div class="tag">GROUP</div>
							{{/if}}
						</div>
                        {{else}}
                        <div class="title dynamic-title">
                        	<div class="event-title">{{page-title}}</div>
                        	{{#if is_event_group}}
								<div class="tag">GROUP</div>
							{{/if}}
                        </div>
                        {{/if}}
						<div class="event-segmentation">
							{{#if segmentations}}
							<div class="cly-select float">
								<div class="select-inner">
									<div class="text-container">
										<div class="text">{{active-segmentation}}</div>
									</div>
									<div class="right combo"></div>
								</div>
								<div class="select-items square" style="width:220px;">
									<div>
										<div data-value="" class="segmentation-option item" data-localize="events.no-segmentation"></div>
										{{#eachOfArray segmentations}}
										<div data-value="{{value}}" class="segmentation-option item">{{value}}</div>
										{{/eachOfArray}}
									</div>
								</div>
							</div>
							{{/if}}
						</div>
					</div>
				</div>
                {{> date-selector }}
			</div>

            <div class="events-general-description">{{{event-description}}}</div>
			<div class="widget-content" style="{{#if graph-type-double-pie}} overflow:hidden; {{else}} height:300px; padding-top:20px; padding-bottom:10px; {{/if}}">
				{{#if graph-type-double-pie}}
				<div class="pie-chart-container">
					<div style="border-right:1px solid #CCC; width: 100%; height: 100%">
						<div class="pie-overlay one {{logo-class}}"></div>
						<div id="dashboard-graph" class="graph" style="margin:0 auto; height:360px; font-family:'Ubuntu';"></div>
					</div>
				</div>
				<div class="pie-chart-container">
					<div class="graph-segment-container">
					{{#if graph-segmentation}}
						<div class="graph-segment {{graph-segmentation.class}}" data-name="{{graph-segmentation.name}}"></div>
					{{/if}}
					</div>
					<div class="pie-overlay two {{logo-class}}"></div>
					<div id="dashboard-graph2" class="graph" style="margin:0 auto; height:360px; font-family:'Ubuntu';"></div>
				</div>
				{{else}}
				<div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px;"></div>
				{{/if}}
			</div>
			{{#if big-numbers}}
			<div class="widget-footer event-numbers big-numbers-v2">
				<div id="big-numbers-container" class="{{big-numbers.class}} event-numbers">
					{{#each big-numbers.items}}
					<div class="big-numbers selected check {{this.class}}" data-type="{{this.class}}">
						<div class="inner">
                            <div class="color"></div>
							<div class="select">{{this.title}}</div>
							<div class="number">{{getFormattedNumber this.total}}</div>
                            <div class="trend {{this.trend}}">
                                {{#ifCond this.trend "==" "u"}}
                                <i class="material-icons">trending_up</i>
                                {{else}}
                                <i class="material-icons">trending_down</i>
                                {{/ifCond}}
                            </div>
						</div>
					</div>
					{{/each}}
				</div>
			</div>
			{{/if}}
		</div>
		{{#if bars}}
		<div class="dashboard-summary three">
			{{#each bars}}
			<div class="item">
				<div class="inner">
					<div class="title">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar">
						{{#each this.data}}
							<div class="bar-inner" style="width:{{this.percent}}%;" data-item="{{this.name}}"></div>
						{{/each}}
					</div>
					<div class="number" data-item="{{this.data.0.name}}">{{this.data.0.name}}</div>
					{{else}}
					<div class="no-data" data-localize="common.bar.no-data"></div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		{{/if}}
        </div>
        {{/ifCond}}
	</script>

    <script id="dashboard-template" type="text/x-handlebars-template">
		<div class="widget">
			<div class="widget-header">
				<div class="title" style="letter-spacing:-1px; font-size:19px; margin-top:10px; margin-left:5px;">{{toUpperCase page-title}}</div>
				{{> date-selector }}
			</div>
			<div class="widget-content" style="border:none;">
                {{#if usage}}
				<div id="big-numbers-container" class="dashboard">
					{{#each usage}}
					<div class="big-numbers top {{#if ../../usage-class}}{{../../usage-class}}{{else}}six-column{{/if}} help-zone-vs" data-help-localize="help.{{this.help}}">
						<div class="inner">
                            <div class="logo {{#if this.ion-icon}} ion {{this.ion-icon}} {{/if}} {{#if this.material-icon}} material {{/if}}">
                                {{#if this.material-icon}}
                                <i class="material-icons">{{this.material-icon}}</i>
                                {{/if}}
                            </div>
							<div class="number">
                                <span class="value">{{getShortNumber this.data.total}}</span>
                                {{#if this.data.isEstimate}}
                                    <span id="total-user-estimate-ind"><i class="fa fa-asterisk"></i></span>
                                    <div id="total-user-estimate-exp" style="display:none;">
                                        <div style="line-height:20px;">
                                            Total (unique) user count for this period is estimated and corrected using the biggest time buckets from available daily, weekly and monthly stats.<br/><br/>
                                            Exact total user counts are available for this year, month and day.
                                        </div>
                                    </div>
                                {{/if}}
                            </div>
                            <div class="title">{{this.title}}</div>
                            <div class="trend {{this.data.trend}}">
                                {{#ifCond this.data.change "==" "NA"}}
                                <i class="material-icons">trending_flat</i>
                                {{else}}
                                {{#ifCond this.data.change "==" "0%"}}
                                <i class="material-icons">trending_flat</i>
                                {{else}}
                                    {{#ifCond this.data.trend "==" "u"}}
                                        <i class="material-icons">trending_up</i>
                                    {{else}}
                                        <i class="material-icons">trending_down</i>
                                    {{/ifCond}}
                                {{/ifCond}}
                                {{/ifCond}}
                                <div class="change">{{this.data.change}}</div>
                            </div>
							<div class="spark"><span class="{{this.data.trend}}sparkline">{{this.data.sparkline}}</span></div>
                            <div class="select" id="{{this.id}}"></div>
						</div>
					</div>
					{{/each}}
				</div>
                {{/if}}
			</div>
			<div class="widget-footer" style="height:220px; padding-top:20px; padding-bottom:10px; overflow:visible; box-shadow:none; position:relative;">
				<div id="dashboard-graph" class="graph" style="height:100%; margin-left:-10px;"></div>
			</div>
		</div>
		<div class="dashboard-summary" id="bar-summary">
			{{#each bars}}
			<div class="item help-zone-vs overview-new-item" data-help-localize="help.{{this.help}}">
				<div class="inner inner-new">
					<div class="title title-new">{{this.title}}</div>
					{{#if this.data}}
					<div class="bar bar-new">
						{{#each this.data}}
							{{#if this.type}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 35px);"
									data-item="{{#limitString this.name 15}}{{/limitString}} ({{this.count}} {{this.unit}})" data-percent="{{round this.percent 0}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{else}}
								<div class="bar-inner bar-inner-new" style="width:calc(100% - 35px);"
									data-item="{{#limitString this.name 15}}{{/limitString}}" data-percent="{{round this.percent 0}}%">
										<div class="bar-inner-percent">{{this.percent}}%</div>
								</div>
							{{/if}}
						{{/each}}
						{{#forNumberOfTimesCalc 3 data.length}}
							<div class="bar-inner bar-inner-new-e" style="width:calc(100% - 30px);">
							</div>
						{{/forNumberOfTimesCalc}}
					</div>
					{{else}}
					<div class="bar bar-new" style="width:100% !important">
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important"
							data-item="" data-localize="common.bar.no-data" data-percent="0">
						</div>
						<div class="bar-inner bar-inner-new-e" style="width:100%;text-align: center;background-color: #ececec;color:black;margin-left:0% !important" data-percent="0">
						</div>
					</div>
					{{/if}}
				</div>
			</div>
			{{/each}}
		</div>
		<div class="widget map-list geo-switch help-zone-vb" data-help-localize="help.dashboard.map">
            <div class="data-type-selector-group">
                <div id="map-list-sessions" class="selector big-numbers top cly-grid-3 active">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="sidebar.analytics.sessions"></div>
                        </div>
                    </div>
                </div>
                <div id="map-list-users" class="selector big-numbers top cly-grid-3">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="sidebar.analytics.users"></div>
                        </div>
                    </div>
                </div>
                <div id="map-list-new" class="selector big-numbers top cly-grid-3">
                    <div class="inner">
                        <div class="select">
                            <div class="title" data-localize="common.table.new-users"></div>
                        </div>
                    </div>
                </div>
            </div>
			<div id="geo-chart-outer"><div id="geo-chart"></div></div>
            <div id="map-list-right"></div>
		</div>
	</script>

    <script id="table-template" type="text/x-handlebars-template">
        <div class="widget">
            <div class="widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                        <div class="title small">{{page-title}}</div>
                        {{else}}
                        <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                    {{#if filter1}}
                    <div style="width:300px; display: block;">
                    <div class="cly-select float filter1-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter1}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter1}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{#if filter2}}
                    <div class="cly-select float filter2-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter2}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter2}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{/if}}
                    </div>
                    {{/if}}
                </div>
                {{> date-selector }}
            </div>
        </div>
        <div class="data-table table-template" data-help-localize="help.{{{chart-helper}}}">
            <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        </div>
    </script>


    <script id="version-history-template" type="text/x-handlebars-template">
		<div class="widget">
            <div>{{ package-version }}</div>
			<div>{{mongo-version}}</div>
            <br>
			<div class="widget-header">
				<div class="title" style="margin-top:10px; margin-left:5px;">{{toUpperCase fs-title}}</div>
			</div>
            <div class="data-table table-template"  data-help-localize="help.{{{chart-helper}}}">
                <table id="data-table-fs" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
            <br>
			<div class="widget-header">
				<div class="title" style="margin-top:10px; margin-left:5px;">{{toUpperCase db-title}}</div>
			</div>
            <div class="data-table table-template"  data-help-localize="help.{{{chart-helper}}}">
                <table id="data-table-db" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
            </div>
        </div>
    </script>

	<script id="graph-note-create" type="text/x-handlebars-template">
		<div class="graph-note-create">
			<div class="title"><span class="note-form-hearder" data-localize="notes.add-note-form-title"></span></div>
			<div class="fields">
				<div class="section">
                    <div class="label" data-localize="notes.note"></div>
                    <textarea maxlength="150" class="note graph-note-textarea"  rows="5" ></textarea>
                    </div>
				<div class="section" style="display: flex;">
                    <div style="width:50%">
                        <div class="label" data-localize="notes.note-date-time"></div>
                        <div class="date-time"> {{> date-time-selector }} </div>
                    </div>
                    <div class="note-types-selector" style="width:50%">
                        <div class="label" data-localize="notes.note-types"></div>
                        <div  data-note-type="private" class="button note-type active" data-localize="notes.note-private"></div>
                        <div  data-note-type="shared" class="button note-type" data-localize="notes.note-shared"> </div>
                        <div  data-note-type="public" class="button note-type" data-localize="notes.note-public"> </div>
                    </div>
				</div>
				<div>
                <div class="section email-select-block" style="display:none;">
                    <div class="label" data-localize='notes.note-share-with'></div>
                    <select id="email-list-input" placeholder="{{email-placeholder}}">
                    </select>
                </div>

				<div>
				<div class="label" data-localize="notes.note-indicator-color"></div>
					<div id="online-widget-section-bar-color" class="settings section" style="margin-bottom: 30px;">
					<div class="colors">
						<div data-color="1" class="color alt1 selected"></div>
						<div data-color="2" class="color alt2"></div>
						<div data-color="3" class="color alt3"></div>
						<div data-color="4" class="color alt4"></div>
						<div data-color="5" class="color alt5"></div>
						<div data-color="6" class="color alt6"></div>
					</div>
					</div>
				</div>
				</div>
			</div>
            <div class="footer">
                <div class="cancel-add-note icon-button white" data-localize="common.cancel"></div>
                <div class="add-note icon-button green" data-localize="notes.note-add-note"></div>
            </div>
		</div>
	</script>

    <script id="template-graph-notes-view" type="text/x-handlebars-template">
        <div class="note-table-view-navigator">
            <a href="#/" class="back-link" >
                <span data-localize="notes.note-back-to-overview"></span>
            </a>
        </div>

        <div class="widget">
            <div class="widget-header">
                <div class="left">
                    <div style="overflow: auto">
                        {{#if filter1}}
                        <div class="title small">{{page-title}}</div>
                        {{else}}
                        <div class="title">{{page-title}}</div>
                        {{/if}}
                    </div>
                    {{#if filter1}}
                    <div style="width:300px; display: block;">
                    <div class="cly-select float filter1-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter1}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter1}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{#if filter2}}
                    <div class="cly-select float filter2-segmentation">
                        <div class="select-inner">
                            <div class="text-container">
                                <div class="text">{{active-filter2}}</div>
                            </div>
                            <div class="right combo"></div>
                        </div>
                        <div class="select-items square" style="width:220px;">
                            <div>
                                {{#eachOfObject filter2}}
                                <div data-value="{{property}}" class="segmentation-option item">{{value}}</div>
                                {{/eachOfObject}}
                            </div>
                        </div>
                    </div>
                    {{/if}}
                    </div>
                    {{/if}}
                </div>
                {{> date-selector }}
            </div>
        </div>
        <div class="data-table table-template" data-help-localize="help.{{{chart-helper}}}">
            <table id="data-table" class="d-table help-zone-vb no-fix" cellpadding="0" cellspacing="0" data-help-localize="help.{{{table-helper}}}"></table>
        </div>
    </script>

    <script id="graph-notes-popup" type="text/x-handlebars-template">
        <div class="graph-note-popup">
            <div class="title">
                <span> {{this.notePopupTitleTime}}</span>
            </div>
            <div class="popup-content">
                {{#if this.notes}}
                    {{#each this.notes}}
                        <div class="note">
														<div class="note-time"> {{this.ts_display}}</div>
														<div class="note-app" style="display:flex; line-height: 15px;">
															<div class='icon' style='display:inline-block; border-radius: 2px; width:15px; height:15px; margin-right: 5px; background: url(appimages/{{this.app_id}}.png) center center / cover no-repeat;'>
															</div>
															{{this.app_name}}
														</div>
                            <div class="note-content">{{this.note}}</div>
                            <div class="note-footer">
                                <span class="note-owner"> {{this.owner_name }}</span> | <span class="note-type">{{this.noteType}}</span>
                            </div>
                        </div>
                    {{/each}}
                {{/if}}
            </div>
            <div class="popup-footer">
                <div class="icon-button white close-note-popup-button">Close</div>
            </div>
        </div>
	</script>
<% if (!offline_mode) { %>
    <% if (use_google) { %>
        <script language="javascript" type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <% } %>
<% } %>
<% if (production) { %>
	    <!-- PRODUCTION -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.visualization.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.config.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.lib.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/min/countly.plugins.js?<%= countlyVersion %>&<%= pluginsSHA %>"></script>
    <% } else { %>
	    <!-- DEVELOPMENT -->
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/utils/textcounter.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/jquery.peity.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/jquery.sparkline.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.tickrotor.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.pie.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.resize.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.stack.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.spline.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.crosshair.js"?<%= countlyVersion %>></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.orderBars.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/flot/jquery.flot.navigate.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/gauge.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/d3/d3.min.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.min.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/visualization/rickshaw/rickshaw.x.axis.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.analytics.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.common.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.config.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.helpers.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.event.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.session.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.city.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.location.js?<%= countlyVersion %>"></script>
	    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.map.helper.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.list.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.osmapping.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.device.detail.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.app.version.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.carrier.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.total.users.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.app.users.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.token.manager.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.version.history.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.view.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/core.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/container.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.template.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/helpers.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/data/vuex.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.task.manager.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/imports.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/nav.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/layout.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/form.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/date.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/dropdown.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/input.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/datatable-legacy.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/datatable.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/dialog.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/drawer.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/notes/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/notes/javascripts/countly.common.notes.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/vis.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/helpers.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/progress.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/directives/scroll-shadow.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/legacy.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.vue.legacy.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/device-and-type/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/device-and-type/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/app-resolution/javascripts/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/app-version/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/jobs/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/logs/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/token-manager/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/report-manager/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/platform/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/carrier/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/carrier/javascripts/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/user-activity/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/user-activity/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/session-overview/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/session-overview/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/session-durations/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/session-durations/javascripts/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/session-frequency/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/session-frequency/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/events/javascripts/countly.details.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/events/javascripts/countly.details.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/events/javascripts/countly.overview.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/events/javascripts/countly.overview.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/geo-countries/javascripts/countly.cities.models.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/geo-countries/javascripts/countly.models.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/user-analytics-overview/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/geo-countries/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/geo-countries/javascripts/countly.widgets.geo.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/app-management/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/app-management/javascripts/countly.views.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/user-management/javascripts/countly.models.js?<%= countlyVersion %>"></script>
        <script language="javascript" type="text/javascript" src="<%- cdn %>core/user-management/javascripts/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/home/javascripts/countly.models.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/home/javascripts/countly.views.js?<%= countlyVersion %>"></script>
		<script language="javascript" type="text/javascript" src="<%- cdn %>core/notes/javascripts/countly.views.js?<%= countlyVersion %>"></script>

        <% if (javascripts) { %>
			<% for(var i=0, l=javascripts.length; i<l; i++) {%>
				<script language="javascript" type="text/javascript" src="<%- cdn %><%= javascripts[i] %>?<%= countlyVersion %>"></script>
			<% } %>
		<% } %>

		<script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/vue/components/sidebar.js?<%= countlyVersion %>"></script>
	<% } %>

    <% if (themeFiles && themeFiles.js) { %>
        <% for(var i=0, l=themeFiles.js.length; i<l; i++) {%>
    		<script language="javascript" type="text/javascript" src="<%=themeFiles.js[i]%>?<%= countlyVersion %>"></script>
        <% } %>
    <% } %>

	<script>Backbone.history.start();</script>
    <% if (!offline_mode) { %>
        <% if (!track || track == "GA" && member['global_admin'] || track == "noneGA" && !member['global_admin']) { %>
            <!--Countly script-->
            <script type='text/javascript' src='<%- cdn %>sdk/web/countly.min.js?<%= countlyVersion %>'></script>
            <script type='text/javascript'>

            //initializing countly with params
            Countly.init({
                app_key: "<%= frontend_app || "386012020c7bf7fcb2f1edf215f1801d6146913f" %>",
                url: "<%= frontend_server || "https://stats.count.ly/" %>",
                device_id: countlyGlobal["member"]["email"],
                app_version: "<%= countlyVersion %>",
                interval:1000
            });

            //track sessions automatically
            Countly.track_sessions();

            Countly.getViewName = function(){
                var view = "/dashboard#";
                var fragment = Backbone.history.getFragment();
                var parts = fragment.split("/");
                if (fragment.indexOf("/analytics/retention/") === 0) {
                    parts[4] = ":event";
                }
                if (fragment.indexOf("/attribution/") === 0) {
                    parts[2] = ":campaign_id";
                }
                for (var i = 1; i < parts.length; i++) {
                    if (/\d/.test(parts[i])) {
                        parts[i] = ":id";
                    }
                    if (parts[i][0] === "{") {
                        parts[i] = ":query";
                    }
                }
                return view + parts.join("/");
            };

            Countly.getViewUrl = function(){
                var view = "/dashboard#";
                var fragment = Backbone.history.getFragment();
                var parts = fragment.split("/");
                if (fragment.indexOf("/analytics/retention/") === 0) {
                    parts[4] = "[CLY]_session";
                }
                if (fragment.indexOf("/attribution/") === 0) {
                    parts[2] = "";
                }
                for (var i = 1; i < parts.length; i++) {
                    if (/\d/.test(parts[i])) {
                        parts[i] = "";
                    }
                    if (parts[i][0] === "{") {
                        parts[i] = "{}";
                    }
                }
                return view + parts.join("/");
            };

            //track pageviews automatically
            Countly.track_pageview(Countly.getViewName());

            $(window).on('hashchange', function() {
                Countly.track_pageview(Countly.getViewName());
            });

            //track any clicks to webpages automatically
            Countly.track_clicks();

            //track javascript errors
            Countly.track_errors();
            
            if (Countly.report_trace && window.performance && window.performance.timing) {
                $(window).on( "load", function(){
                    setTimeout(function(){
                        var trace = {
                            type: "device",
                            name: Countly.getViewName(),
                            stz: window.performance.timing.navigationStart,
                            etz: window.performance.timing.domContentLoadedEventEnd,
                            apm_metrics: {}
                        };
                        if (window.performance.timing.domLoading && window.performance.timing.navigationStart) {
                            trace.apm_metrics.first_paint = window.performance.timing.domLoading - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domContentLoadedEventStart && window.performance.timing.navigationStart) {
                            trace.apm_metrics.first_contentful_paint = window.performance.timing.domContentLoadedEventStart - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domInteractive && window.performance.timing.navigationStart) {
                            trace.apm_metrics.dom_interactive = window.performance.timing.domInteractive - window.performance.timing.navigationStart;
                        }
                        if (window.performance.timing.domContentLoadedEventEnd && window.performance.timing.domContentLoadedEventStart) {
                            trace.apm_metrics.dom_content_loaded_event_end = window.performance.timing.domContentLoadedEventEnd - window.performance.timing.domContentLoadedEventStart;
                        }
                        if (window.performance.timing.loadEventEnd && window.performance.timing.loadEventStart) {
                            trace.apm_metrics.load_event_end = window.performance.timing.loadEventEnd - window.performance.timing.loadEventStart;
                        }
                        if (Object.keys(trace.apm_metrics).length) {
                            Countly.report_trace(trace);
                        }
                    },1);
                });
            }

            Countly.user_details({
                "name": countlyGlobal["member"]["full_name"] || "",
                "username": countlyGlobal["member"]["username"] || "",
                "email": countlyGlobal["member"]["email"]
            });

            Countly.userData.set("lastServer", window.location.hostname);
            Countly.userData.set("lastVersion", "<%= countlyVersion %>");
            Countly.userData.set("lastEdition", "<%= countlyTypeTrack %>");
            Countly.userData.set("isTrial", <%= countlyTrial %>);
            <% if (!offline_mode) { %>
                Countly.userData.set("cpus", <%= cpus %>);
            <% } %>
            Countly.userData.push_unique("servers", window.location.hostname);
            Countly.userData.push_unique("versions", "<%= countlyVersion %>");
            Countly.userData.push_unique("editions", "<%= countlyTypeTrack %>");
            Countly.userData.save();

            <% if (installed) { %>
            Countly.add_event({
                key:"INSTALL"
            });
            <% } %>
            </script>
        <% } %>
    <% } %>
    <script type='text/javascript'>
    app.recordEvent = function (event) {
        if (typeof Countly !== "undefined" && Countly.add_event) {
            Countly.add_event(event);
        }
    };
    </script>

    <% if (typeof inject_template.html != "undefined") { %>
        <%- inject_template.html %>
    <% } %>
    <% if (typeof inject_template.js != 'undefined') { %>
	<script><%- inject_template.js %></script>
	<% } %>
    <% if (!offline_mode) { %>
    <!-- Zest code Snippet -->
    <script>(function(){window.addEventListener("load",function(){var t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src="https://app.hellozest.io/widget/embed/z05qxwmw",document.body.appendChild(t)});})();</script>
    <% } %>
    <!-- The last countly script to load -->
    <script language="javascript" type="text/javascript" src="<%- cdn %>javascripts/countly/countly.loaded.js?<%= countlyVersion %>"></script>
</body>
</html>